<template>
	<view class="flex-col page">
		<view class="flex-col group">
			<view class="flex-col">
				<view class="flex-col section_3">
					<view class="justify-between group_2" @click="go('/pages/my/setting/security/security')">
						<text class="text_1">账号与安全</text>
						<image :src="imgUrl+'16557838861113221762.png'" class="image_2 image_3" />
					</view>
					<image :src="imgUrl+'16557836384872241555.png'" class="image_4" />
					<view class="justify-between group_3" @click="go('/pages/my/setting/feedback/feedback')">
						<text class="text_2">意见反馈</text>
						<image :src="imgUrl+'16557838861113221762.png'" class="image_2 image_6" />
					</view>
					<image :src="imgUrl+'16557836384872241555.png'" class="image_4" />
					<view class="justify-between group_3" @click="go('/pages/guide/guide?identification='+ 2)">
						<text class="text_2">关于我们</text>
						<image :src="imgUrl+'16557838861113221762.png'" class="image_2 image_6" />
					</view>
					<image :src="imgUrl+'16557836384872241555.png'" class="image_4" />
					<view class="justify-between group_3" @click="go('/pages/guide/guide?identification='+ 3)">
						<text class="text_2">用户注册协议</text>
						<image :src="imgUrl+'16557838861113221762.png'" class="image_2 image_6" />
					</view>
					<image :src="imgUrl+'16557836384872241555.png'" class="image_4" />
					<view class="justify-between group_4" @click="go('/pages/guide/guide?identification='+ 4)">
						<text class="text_6">隐私政策</text>
						<image :src="imgUrl+'16557838861113221762.png'" class="image_2 image_13" />
					</view>
				</view>
				<view class="flex-col section_4">
					<view class="justify-between group_5" @click="clearStorage">
						<text class="text_7">清除缓存</text>
						<view class="flex-row group_6">
							<text class="text_8">{{size}}</text>
							<image :src="imgUrl+'16557838861113221762.png'" class="image_2 image_14" />
						</view>
					</view>
					<image :src="imgUrl+'16557836384872241555.png'" class="image_4" />
					<view class="justify-between group_7" @click="getAppInfo">
						<text class="text_9">检查更新</text>
						<view class="flex-row group_8">
							<text class="text_10">{{version}}</text>
							<image :src="imgUrl+'16557838861113221762.png'" class="image_2 image_16" />
						</view>
					</view>
					<image :src="imgUrl+'16557836384872241555.png'" class="image_4" />
					<view class="justify-between group_7" @click="go('/pages/my/setting/security/layout1')">
						<text class="text_9">注销账号</text>
						<view class="flex-row group_8">
							
							<image :src="imgUrl+'16557838861113221762.png'" class="image_2 image_16" />
						</view>
					</view>
				</view>
			</view>
			<view class="flex-col items-center button" @click="goLogout"><text class="text_11">退出登录</text></view>
			<u-modal :show="show" :title="title"></u-modal>
		</view>
		<shop-check-login></shop-check-login>

		<u-modal :show="maskShow" @confirm="confirm" title="提示" @cancel='cancel' content="确定清除本地缓存吗?" showCancelButton>
		</u-modal>
	</view>
</template>

<script>
	import {
		checkUpdate
	} from "@/components/appupdate/js/app-update-check.js";
	import {
		mapMutations,
		mapActions,
		mapState,
		mapGetters
	} from 'vuex';
	export default {
		components: {},
		data() {
			return {
				version: '1.0.0',
				cacheSize: 15.6,
				imgUrl: this.$IMG_URL,
				show: false,
				title: '是否确认退出!',
				maskShow: false
			};
		},
		onLoad() {
			// #ifdef APP-PLUS
			plus.runtime.getProperty(plus.runtime.appid, (wgtinfo) => {
				this.version = wgtinfo.version
			})
			// #endif
		},

		computed: {
			...mapGetters(['isLogin']),
			size() {
				// #ifdef APP-PLUS
				let self = this;
				plus.cache.calculate(size => {
					if (size < 1024) {
						self.cacheSize = size + 'B';
					} else if (size / 1024 >= 1 && size / 1024 / 1024 < 1) {
						self.cacheSize = Math.floor((size / 1024) * 100) / 100 + 'KB';
					} else if (size / 1024 / 1024 >= 1) {
						self.cacheSize = Math.floor((size / 1024 / 1024) * 100) / 100 + 'M';
					}
				});
				return this.cacheSize;
				// #endif
				// #ifndef APP-PLUS
				return this.cacheSize;
				// #endif 



			}
		},
		methods: {
			...mapActions(['logout']),
			cancel() {
				this.maskShow = false;
			},
			confirm() {
				// #ifdef APP-PLUS
				let self = this;
				plus.cache.clear(res => {

					uni.showToast({
						title: '清除成功！',
						icon: 'none',
						success() {
							self.cacheSize = '0';

						}
					});
				});
				// #endif
				// #ifndef APP-PLUS
				this.cacheSize = 0;
				// #endif 
				this.cancel()
			},
			clearStorage() {
				this.maskShow = true;
				// // #ifdef APP-PLUS
				// let self = this;
				// uni.showModal({
				// 	title: '提示',
				// 	content: '确定清除本地缓存吗？',
				// 	success: function(res) {
				// 		if (res.confirm) {
				// 			plus.cache.clear(res => {
				// 				uni.showToast({
				// 					title: '清除成功！',
				// 					icon: 'none',
				// 					success() {
				// 						self.cacheSize = '0';
				// 					}
				// 				});
				// 			});
				// 		} else if (res.cancel) {
				// 			console.log('用户点击取消');
				// 		}
				// 	}
				// });

				// // #endif
				// // #ifndef APP-PLUS
				// this.cacheSize = 0;
				// // #endif 
			},
			goLogout() {
				uni.showModal({
					title: '提示',
					// 提示文字
					content: '确认退出吗？',
					// 取消按钮的文字自定义
					cancelText: "取消",
					// 确认按钮的文字自定义
					confirmText: "确定",
					//删除字体的颜色
					confirmColor: '#000000',
					//取消字体的颜色
					cancelColor: '#000000',
					success: res => {
						if (res.confirm) {
							this.logout();
						} else {
							// 执行取消后的操作
						}
					}


				})
			},
			//获取线上APP版本信息
			getAppInfo(t = 0) {

				const system_info = uni.getSystemInfoSync();
				console.log(system_info);
				let type = 1;
				if (system_info.platform == 'android') {
					type == 1;
				} else if (system_info.platform == 'ios') {
					type: 2
				}
				this.$http('version.query', {
					systemType: type,
					appType: 1
				}).then(res => {
					console.log(res);
					if (res.code == 200) {
						let update_info = {
							version: res.data.version, //线上版本
							now_url: res.data.nowUrl, //更新链接
							silent: 0, //是否是静默更新
							force: res.data.forces, //是否是强制更新
							silent: 0, //是否是静默更新
							force: res.data.forces, //是否是强制更新

							net_check: 1, //非WIfi是否提示
							note: res.data.note, //更新内容
						};

						checkUpdate(update_info, t).then(r => {

							if (r.update == 1) {
								//弹出更新

								uni.setStorageSync('updateinfo', update_info)
								uni.redirectTo({
									url: "/pages/appupdate",
									success: function() {
										console.log(22323);

									}

								})


							} else {
								if (res.msg) {

									plus.nativeUI.toast('已是最新版本~');

								}
							}

						}); ///检查更新
						//checkUpdate 这个方法会做什么？：线上版本号 与 本地版本号做对比 ，如果需要更新  根据静默，强制、wifi等信息执行静默更新或跳转到升级页面
						//跳转升级页面的前提是，需要新建并在pages.json中配置升级页面，配置方法请查看插件详情
					}
				});
				// if (params.os != 'ios' && params.os != 'android') false; //如果不是安卓或ios 返回false

				//这里自行请求API获取版本信息 建议传入操作系统标识，返回本机对应的操作系统最新版本信息，也就是安卓的返回就是安卓的版本信息  ios返回就是ios的版本信息
				//请求获取最新版本

			},
		},
	};
</script>

<style scoped lang="scss">
	/deep/ .u-modal__content__text {
		text-align: center;
	}
	.image_4 {
		width: 91.4667vw;
		height: 0.2667vw;
	}

	.group_3 {
		padding: 28rpx 0 40rpx;
	}

	.image_2 {
		width: 14rpx;
		height: 26rpx;
	}

	.text_2 {
		font-weight: 500;
		color: #333333;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 38rpx;
	}

	.image_6 {
		margin-top: 13rpx;
	}

	.page {
		background-color: #f6f7f9;
		width: 100%;
		overflow-y: auto;
		overflow-x: hidden;
		height: 100vh;
		position: fixed;
	}

	.group {
		flex: 1 1 auto;
		overflow-y: auto;
	}

	.button {

		padding: 30rpx 37rpx;
		background-color: #ffffff;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
	}

	.section_3 {
		padding-left: 32rpx;
		padding-right: 31.5rpx;
		background-color: #ffffffff;
	}

	.section_4 {
		margin-top: 20rpx;
		padding: 0 32rpx;
		background-color: #ffffffff;
	}

	.text_11 {
		color: #1d6aff;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 38rpx;
	}

	.group_2 {
		padding: 25.5rpx 0 40rpx;
	}

	.group_4 {
		padding: 27.5rpx 0 40.5rpx;
	}

	.group_5 {
		padding: 29rpx 0 35rpx;
	}

	.group_7 {
		padding: 28rpx 0 38rpx;
	}

	.text_1 {
		font-weight: 500;
		color: #333333;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 38rpx;
	}

	.image_3 {
		margin-top: 13rpx;
	}

	.text_6 {
		font-weight: 500;
		color: #333333;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 38rpx;
	}

	.image_13 {
		margin-top: 13rpx;
	}

	.text_7 {
		font-weight: 500;
		margin-bottom: 6rpx;
		color: #333333;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 38rpx;
	}

	.group_6 {
		margin-top: 11rpx;
	}

	.text_9 {
		font-weight: 500;
		margin-bottom: 4rpx;
		color: #333333;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 38rpx;
	}

	.group_8 {
		margin-top: 9rpx;
	}

	.text_8 {
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.image_14 {
		margin-left: 22rpx;
		margin-bottom: 5rpx;
		flex-shrink: 0;
	}

	.text_10 {
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.image_16 {
		margin: 3rpx 0 4rpx 22rpx;
		flex-shrink: 0;
	}
</style>
